<template>
  <el-dialog
    v-model="dialog.visible"
    title="接口请求记录详情"
    @open="openHandler"
    @close="closeHandler"
    :close-on-click-modal="false"
    append-to-body
    center
  >
    <el-form ref="dataForm" :model="entity" label-suffix="：">
      <el-row :gutter="20">
        <el-col :span="24">
          <el-form-item prop="authorization" label="authorization">
            <span>{{ entity.authorization }}</span>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="24">
          <el-form-item prop="parameters" label="请求参数">
            <span class="w-b-b-w">{{ entity.parameters }}</span>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="24">
          <el-form-item prop="jsonResult" label="响应结果">
            <span class="w-b-b-w">{{ entity.jsonResult }}</span>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="24">
          <el-form-item prop="errorMsg" label="错误信息">
            <span class="w-b-b-w">{{ entity.errorMsg }}</span>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <template #footer>
      <cancel-button @click="dialog.visible = false" />
    </template>
  </el-dialog>
</template>
<script>
import { getDetail } from '@/api/log/handlerLog'

export default {
  name: 'HandlerView',
  props: {
    dialog: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {
      loading: false,
      entity: {},
    }
  },
  methods: {
    openHandler() {
      getDetail(this.dialog.entity.id).then((res) => {
        this.entity = res.data.data
      })
    },
    closeHandler() {
      this.entity = {}
      this.$refs.dataForm.clearValidate()
    },
  },
}
</script>
